<template>
	<div id="box">
		<van-row id="top" span="24">
			<van-col span="4">
				<h3>Hi</h3>
			</van-col>
			<van-col span="4" offset="16">
				<van-icon name="service-o" size="20" />
			</van-col>
		</van-row>
		<div id="back">
			<h3>欢迎回来!</h3>
		</div>
		<van-tabs v-model="active" id="qi">
			<van-tab title="快捷登录">
				<quickLogin></quickLogin>
			</van-tab>
			<van-tab title="账号登录">
				<IDLogin></IDLogin>
			</van-tab>
		</van-tabs>
	</div>
</template>

<script>
	import quickLogin from './quickLogin.vue'
	import IDLogin from './IDLogin.vue'
	export default {
		data() {
			return {
				active: 0,
			}
		},
		components: {
			quickLogin,
			IDLogin
		},
		created() {
		
		}
	}
</script>

<style>
	* {
		margin: 0;
		padding: 0;
	}

	#top {
		margin-top: 3vh;
	}

	#box {
		font-size: 0.5rem;
	}

	#back {
		margin-top: 1vh;
	}

	#qi {
		font-size: 0.3rem;
		margin-top: 6vh;
	}

	.van-tab {
		font-size: 0.4rem;
		font-weight: bold;
	}

	.van-tabs--line .van-tabs__wrap {
		height: 6vh;
		width: 100vw;
	}

	.van-tabs__line {
		background-color: #000;
	}

	.van-tab__pane {
		width: 100vw;
	}
</style>
